<template>
	<view class="content">
		<global-notify></global-notify>
		<view class="head">
			<view class="baseInfo">
				<u-avatar :src="userInfo.avatar || defaltAva" size="60" shape="circle" class="avatar"
					@click="upload_avatar"></u-avatar>
				<view class="baseInfoContent">
					<view class="personInfo">
						<view class="mainContent">{{userInfo.name}} <span class="unit" v-if="isLawyer">&nbsp;&nbsp;律师</span></view>
						<view v-if="isLawyer" class="descContent">执业证号：{{lawyerInfo.licenseNumber || '--'}}</view>
					</view>
					<view class="creditCard">
						<view class="creditCardIcon"></view>
						<view class="creditCardLabel">名片</view>
					</view>
				</view>
			</view>
			<view v-if="isLawyer" class="extraInfo">
				<view class="extraInfoContent">
					<view class="extraInfoItem">
						<view class="timeIcon"></view>
						<view class="extraInfoLabel">执业时间：{{lawyerInfo.startWorkDate || '--'}}</view>
					</view>
					<view class="extraInfoItem">
						<view class="buildIcon"></view>
						<view class="extraInfoLabel">所属律所：{{lawFirmInfo.lawFirmName || '--'}}</view>
					</view>
				</view>
				<view class="refreshIcon" @click="refreshData"></view>
			</view>
		</view>

		<view class="mainCells">
			<u-cell-group :border='false' >
				<u-cell :key="cell.key" v-for="cell in cells" :icon="cell.icon" :border='cell.border' :title="cell.title"
					@click="goHistroy(cell)" :isLink="cell.isLink"></u-cell>
			</u-cell-group>
			
			<u-cell-group :border='false'>
				<u-cell :key="cell.key" v-for="cell in baseCell" :icon="cell.icon" :border='cell.border' :title="cell.title"
					@click="goCell(cell)" :isLink="cell.isLink"></u-cell>
			</u-cell-group>
		</view>
		<view style="padding: 1rem ;">
			<u-button @click="() => {showModal=true}" type="primary" style="width: 100%;">
				退出登陆
			</u-button>
		</view>
		<u-modal :show="showModal" showCancelButton title="退出登录" content='确定要退出吗?' @cancel="()=>{showModal=false}"
			@confirm="confirmExit"></u-modal>

	</view>
</template>

<script>
	import {
		toast,
		clearStorageSync,
		setStorageSync,
		getStorageSync,
		useRouter
	} from '@/utils/utils.js'
	export default {
		data() {
			return {
				defaltAva: require('@/static/images/avatar.png'),
				showModal: false,
				baseInfo: {
					name: '',
					phone: '',
					avatar: '',
					company_name: '',
					registerDate: '',
					login_code: '',
				},
				version: "",
				icTypes: [],
				systemRoles: [],
				userInfo: getStorageSync('userInfo') || {},
				lawyerInfo: getStorageSync('lawyerInfo') || {},
				lawFirmInfo: getStorageSync('lawFirmInfo') || {},
				baseCell: [{
						title: '个人信息',
						isLink: true,
						icon: "account-fill",
						key: 'profile'
					},
					// {
					// 	title: '帐号安全',
					// 	isLink: true,
					// 	icon: "lock-fill",
					// 	key: 'account'
					// },
					// {
					// 	title: '设置',
					// 	isLink: true,
					// 	icon: "setting-fill",
					// 	key: 'setting'
					// },
					{
						title: '关于我们',
						isLink: true,
						icon: "info-circle",
						key: 'about'
					}
				]
			}
		},
		computed: {
			isAdmin: function() {
				return (this.systemRoles || []).indexOf('admin') >= 0
			},
			hasOperationRole: function() {
				return (this.systemRoles || []).indexOf('OPERATION_MANAGER') >= 0 || (this.systemRoles || []).indexOf(
					'OPERATION') >= 0
			},
			isLawyer: function() {
				return Object.keys(this.lawyerInfo).length > 0
			},
			cells: function() {
				let base = []
				this.icTypes.forEach(item => {
					if (item.isOpen && (this.hasOperationRole || this.isAdmin || this.systemRoles.indexOf(item.systemRole) >=
							0)) {
						base.push({
							title: item.label,
							isLink: true,
							icon: "order",
							key: item.value
						})
					}
				})
				return base
			},
		},
		onLoad() {
			const that = this
			uni.getSystemInfo({
				success: function(res) {
					console.log("res", res)
					that.version = res.appVersion
				}
			})
			this.getICTypes()
			this.getSystemRoles()
		},
		methods: {
			getICTypes: async function() {
				this.icTypes = await this.$commonData.getICTypes()
			},
			getSystemRoles: async function() {
				this.systemRoles = await this.$commonData.getSystemRoles()
			},
			refreshData: function() {
				console.log('start refreshData')
				this.getUserInfo()
			},
			getUserInfo: function() {
				this.$api.userInfo(null).then(res => {
					if (res.success) {
						let data = res.result || {}
						let userInfo = data.userInfo || {}
						userInfo.pw = null
						this.userInfo = userInfo
						this.systemRoles = data.systemRoles || []
						this.lawyerInfo = data.lawyerInfo || {}
						this.lawFirmInfo = data.lawFirmInfo || {}
						setStorageSync('userInfo', userInfo)
						setStorageSync('systemRoles', data.systemRoles || [])
						setStorageSync('lawyerInfo', data.lawyerInfo || {})
						setStorageSync('lawFirmInfo', data.lawFirmInfo || {})
					} else {
						toast(res.message)
					}
				}).catch(err => {
					console.log("logout error", err)
					toast("刷新用户信息失败！")
				})
			},
			upload_avatar() {
				const _this = this
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: function(res) {
						uni.uploadFile({
							url: _this.$api_url + '/api/index/upload_cos',
							filePath: res.tempFilePaths[0],
							name: 'file',
							formData: {
								floder: 'avatar'
							},
							success: (uploadFileRes) => {
								//let retData = JSON.parse(uploadFileRes)

								let retData = JSON.parse(uploadFileRes.data)
								console.log('up:', retData)
								const _data = {
									avatar: retData.data.file
								}
								_this.$api.baseInfoSave(_data).then(ret => {
									if (ret.code == 1) {
										_this.baseInfo.avatar = retData.data.file
									} else {
										toast(res.msg)
									}
								})

							}
						});
					}
				});
			},
			goCell: function(cell) {
				switch (cell.key) {
					case 'profile':
						useRouter('/pages/mine/profile', {}, 'navigateTo')
						break
					case 'account':
						useRouter('/pages/mine/account/index', {}, 'navigateTo')
						break
					case 'setting':
						useRouter('/pages/mine/account/setting', {}, 'navigateTo')
						break
					case 'about':
						useRouter('/pages/mine/about/index', {}, 'navigateTo')
						break
				}
			},
			goHistroy: function(cell) {
				useRouter('/pages/consultant/history'+cell.key, {}, 'navigateTo')
			},
			confirmExit() {
				let that = this
				this.$api.logout().then(res => {
					if (res.success) {
						this.$store.dispatch('resetAll')
						uni.$emit('destoryIM')
						uni.reLaunch({
							url: that.$systemConfig.login_page
						})
					} else {
						toast(res.message)
					}
				}).catch(err => {
					console.log("logout error", err)
					toast("退出登录失败！")
				}).finally(() => {
					that.showModal = false
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.head {
		padding: 1rem;
		background: linear-gradient(to right, #0467f2 0%, #7ec2ec 100%);
		min-height: 120px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		// padding-top: 60rpx;

		.baseInfo {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.baseInfoContent {
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
				color: #fff;
				flex-grow: 1;

				.creditCardLabel {
					font-size: 12px;
					scale: 0.8;
				}

				.creditCardIcon {
					background-image: url('/static/images/creditCard.png');
					background-repeat: no-repeat;
					background-position: center;
					background-size: 100%;
					width: 20px;
					height: 20px;
				}
			}
		}
	}

	// .avatar {
	// 	margin-left: 50rpx;
	// }

	.personInfo {
		color: #fff;
		font-size: 30rpx;
		margin-left: 1rem;
		line-height: 50rpx;

		.mainContent {
			font-size: 1.1rem;
			font-weight: 500;
			margin-bottom: 5px;

			.unit {
				margin-left: 10px;
			}
		}


		.descContent {
			font-size: 0.85rem;
		}
	}

	.extraInfo {
		color: #fff;
		font-size: 12px;
		margin-top: 1rem;
		display: flex;
		align-items: center;


		.refreshIcon {
			background-image: url('/static/images/refresh.png');
			background-repeat: no-repeat;
			background-position: center;
			background-size: 100%;
			width: 2rem;
			height: 2rem;
		}

		.extraInfoContent {
			flex-grow: 1;


			.extraInfoItem {
				margin: 5px 0;
				display: flex;
				opacity: 0.9;



				.timeIcon {
					background-image: url('/static/images/time.png');
					background-repeat: no-repeat;
					background-position: center;
					background-size: 100%;
					width: 1rem;
					height: 1rem;
				}

				.buildIcon {
					background-image: url('/static/images/building.png');
					background-repeat: no-repeat;
					background-position: center;
					background-size: 100%;
					width: 1rem;
					height: 1rem;
				}

				.extraInfoLabel {
					margin-left: 10px;

				}
			}
		}
	}


	.auth {
		flex: 1;
		text-align: right;
		margin-top: 40rpx;
	}
</style>